<template>
  <div>
    <crud-form
      :field-list="fieldList"
      :api="getQueryByPage"
      :exportFn="exportAssetSite"
      :queryParam="formInline"
      :showIndex="false"
      :showCheckbox="fasle"
      ref="crudForm"
    >
      <template slot="searchBar">
        <topform ref="topform" :queryParam="formInline" />
      </template>

      <template slot="tableTopOptionLeft">
      </template>
      <template slot="tableTopOptionRight">
        <excel-upload :import-url="importUrl" :multiple="false" :http-request="httpRequest"/>
        <el-button size="mini" class="newButtonColor listBTN" @click="downloadExcelTem">下载Excel模版</el-button>
      </template>

    </crud-form>
  </div>
</template>

<script>
import crudForm from "@/components/crudForm/index";
import biaoge from "./components/order/biaoge";
import topform from "./components/order/topform";
import {
  getQueryByPage
} from "./order.js";
import excelUpload from "@/components/upload/excelUpload";
import request from "@/api/request";
import { orderUrl } from "@/utils/downloadTemUrls";
export default {
  data() {
    return {
      formInline: {},
      getQueryByPage,
      fieldList: [
        { name: "编号", value: "id" },
        { name: "开始时间", value: "start_time" },
        { name: "结束时间", value: "end_time"},
        { name: "城市", value: "city" },
        { name: "运营商", value: "company" },
        { name: "工作日订单", value: "work_day"},
        { name: "周末订单", value: "weekend"},
        { name: "经度", value: "x" },
        { name: "纬度", value: "y" },
        { name: "备注", value: "remark" }
      ],
      importUrl: "",
    };
  },
  components: { crudForm, topform, biaoge, excelUpload },
  created() {
    this.init();
    this.importUrl = request.importExcelT3Url();

  },
  methods: {
    init() {
    },
    //下载excel 模版
    downloadExcelTem() {
      let a = document.createElement("a");
      a.href = orderUrl;
      a.click();
    },
    //导出
    exportAssetSite() {
      this.$refs.crudForm.queryParam = this.$refs.topform.formInline;
      this.$refs.crudForm.getDataInit();
      this.$refs.topform.formInline.headers = this.$refs.crudForm.exportData.headers;
      this.$refs.topform.formInline.values = this.$refs.crudForm.exportData.values;
    
    this.$confirm("确认导出吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "",
      }).then(() => {
        exportStation(this.$refs.topform.formInline)
          .then((res) => {
            if (res.code === "000000") {
              this.$message({
                message: "正在导出，请稍等...",
                type: "info",
              });
              let aLink = document.createElement("a");
              aLink.href = res.data;
              aLink.click();
              this.$message({
                message: res.mesg,
                type: "success",
              });
            }
          })
          .catch((res) => {
            this.$message({
              message: res.mesg,
              type: "error",
            });
          });
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.default-class {
  width: 100%;
  height: 100%;
  .list {
    height: 100%;
    overflow-y: auto;
    padding: 20px;
    box-sizing: border-box;
  }
}

/deep/ .table-top-option-wrap {
  margin: 0 !important;
}
/deep/ .table-top-option-wrap .right {
  height: 30px;
  margin-top: 10px;
  margin-right: 15px;
}
/deep/ .el-input-group__append {
  padding: 0 30px;
}
</style>
